import { defineStore } from 'pinia';
import { ref } from 'vue';

export const useVideoStore = defineStore('video', () => {
  // 视频相关状态
  const videoFile = ref(null);
  const sourceVideo = ref(null);
  const videoDimensions = ref({ width: 0, height: 0 });
  const currentTime = ref(0);
  
  // 处理参数
  const cropParams = ref({ left: 0, top: 0, width: 0, height: 0 });
  const frameInterval = ref(1);
  const colorHex = ref('#00ff00');
  const targetColor = ref([0, 255, 0]);
  const enableTransparency = ref(true);
  const colorThreshold = ref(50);
  const previewBgColor = ref('#ffffff');
  const startTime = ref(0);
  const endTime = ref(0);
  
  // 预览和处理状态
  const previewImageUrl = ref(null);
  const progressValue = ref(0);
  const statusMessage = ref('准备就绪');
  const frames = ref([]);
  
  // 画布相关
  const canvas = ref(null);
  const ctx = ref(null);
  
  return {
    // 状态
    videoFile,
    sourceVideo,
    videoDimensions,
    currentTime,
    cropParams,
    frameInterval,
    colorHex,
    targetColor,
    enableTransparency,
    colorThreshold,
    previewBgColor,
    startTime,
    endTime,
    previewImageUrl,
    progressValue,
    statusMessage,
    frames,
    canvas,
    ctx
  };
});